<template>
  <div id="app-container">
    <el-config-provider :locale="currentLanguage">
      <router-view />
    </el-config-provider>
  </div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n' 
const { t: $t,locale } = useI18n()
//@ts-ignore
import elCn from 'element-plus/dist/locale/zh-cn.mjs'
import elEn from 'element-plus/dist/locale/en.mjs'
import elTw from 'element-plus/dist/locale/zh-tw.mjs'
// 使用omputed监听语言的变化，确定该给element使用中文包还是英文包
const currentLanguage = computed(() => {
  let lang =  locale.value || localStorage.getItem('lang') || 'zh'
  if (lang === 'zh') {
    return elCn
  }
  if (lang === 'tw') {
    return elTw
  }
  return elEn
})
</script>
<style lang="scss">
#demo-tabsLang{
  .el-tabs--card>.el-tabs__header{
    width: 279px !important;
    position: absolute;
    top: 10px;
    left: 40%;
    z-index: 5;
  }
  .el-tabs__item{
    padding: 0 10px;
  }
}

#app-container{
  width: 100%;
  height: 100%;
}
// .el-table >>> tbody tr:hover>td { background: #ebf7fb !important; }


</style>
